<%--
  Created by IntelliJ IDEA.
  User: ASUS
  Date: 2020/8/18
  Time: 16:26
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=0">

    <title>个人资料</title>

    <link href="${pageContext.request.contextPath}/front/AmazeUI-2.4.2/assets/css/admin.css" rel="stylesheet" type="text/css">
    <link href="${pageContext.request.contextPath}/front/AmazeUI-2.4.2/assets/css/amazeui.css" rel="stylesheet" type="text/css">

    <link href="${pageContext.request.contextPath}/front/css/personal.css" rel="stylesheet" type="text/css">
    <link href="${pageContext.request.contextPath}/front/css/infstyle.css" rel="stylesheet" type="text/css">
    <script src="${pageContext.request.contextPath}/front/AmazeUI-2.4.2/assets/js/jquery.min.js" type="text/javascript"></script>
    <script src="${pageContext.request.contextPath}/front/AmazeUI-2.4.2/assets/js/amazeui.js" type="text/javascript"></script>

</head>

<body>
<!--头 -->
<header>
    <article>
        <div class="mt-logo">
            <!--顶部导航条 -->
            <div class="am-container header">
                <div id="top-lo"></div>
                <%--<ul class="message-r">
                    <div class="topMessage home">
                        <div class="menu-hd"><a href="index.html" target="_top" class="h">商城首页</a></div>
                    </div>
                    <div class="topMessage my-shangcheng">
                        <div class="menu-hd MyShangcheng"><a href="userInfo.html" target="_top"><i class="am-icon-user am-icon-fw"></i>个人中心</a></div>
                    </div>
                    <div class="topMessage mini-cart">
                        <div class="menu-hd"><a id="mc-menu-hd" href="shopcart.html" target="_top"><i class="am-icon-shopping-cart  am-icon-fw"></i><span>购物车</span><strong id="J_MiniCartNum" class="h">0</strong></a></div>
                    </div>
                    <div class="topMessage favorite">
                        <div class="menu-hd"><a href="collection.html" target="_top"><i class="am-icon-heart am-icon-fw"></i><span>收藏夹</span></a></div>
                </ul>--%>
            </div>

            <!--悬浮搜索框-->

            <div class="nav white">
                <div class="logoBig">
                    <li><a href="index.html"><img src="images/logobig.png" /></a></li>
                </div>

                <div class="search-bar pr">
                    <a name="index_none_header_sysc" href="#"></a>
                    <form>
                        <input id="searchInput" name="index_none_header_sysc" type="text" placeholder="搜索" autocomplete="off">
                        <input id="ai-topsearch" class="submit am-btn" value="搜索" index="1" type="submit">
                    </form>
                </div>
            </div>

            <div class="clear"></div>
        </div>
        </div>
    </article>
</header>
<div class="nav-table">
    <div class="long-title"><span class="all-goods">全部分类</span></div>
    <div class="nav-cont">
        <ul>
            <li class="index"><a href="index.html">首页</a></li>
            <li class="qc"><a href="javascript:void(0)">闪购</a></li>
            <li class="qc"><a href="javascript:void(0)">限时抢</a></li>
            <li class="qc"><a href="javascript:void(0)">团购</a></li>
            <li class="qc last"><a href="javascript:void(0)">大包装</a></li>
        </ul>
        <div class="nav-extra">
            <i class="am-icon-user-secret am-icon-md nav-user"></i><b></b>我的福利
            <i class="am-icon-angle-right" style="padding-left: 10px;"></i>
        </div>
    </div>
</div>
<b class="line"></b>
<div class="center">
    <div class="col-main">
        <div class="main-wrap">

            <div class="user-info">
                <!--标题 -->
                <div class="am-cf am-padding">
                    <div class="am-fl am-cf"><strong class="am-text-danger am-text-lg">个人资料</strong> / <small>Personal&nbsp;information</small></div>
                </div>
                <hr/>

                <!--头像 -->
                <div class="user-infoPic">

                    <div class="filePic">
                        <input type="file" class="inputPic" allowexts="gif,jpeg,jpg,png,bmp" accept="image/*">
                        <img class="am-circle am-img-thumbnail" src="images/getAvatar.do.jpg" alt="" />
                    </div>

                    <p class="am-form-help">头像</p>

                    <div class="info-m">
                        <div><b>用户名：<i>${sessionScope.frontUser.username }</i></b></div>
                        <div class="u-level">
									<span class="rank r2">
							             <s class="vip1"></s><a class="classes" href="#">铜牌会员</a>
						            </span>
                        </div>
                        <div class="u-safety">
                            <a href="safety.html">
                                账户安全
                                <span class="u-profile"><i class="bc_ee0000" style="width: 60px;" width="0">60分</i></span>
                            </a>
                        </div>
                    </div>
                </div>

                <!--个人信息 -->
                <div class="info-main">
                    <form class="am-form am-form-horizontal" action="/UserController/updateInfo" method="post" id="form">

                        <div class="am-form-group">
                            <label for="userName" class="am-form-label">用户名</label>
                            <div class="am-form-content">
                                <input type="text" id="userName" name="userName" readonly="readonly" value="${sessionScope.frontUser.username }">

                            </div>
                        </div>

                        <div class="am-form-group">
                            <label for="user-name2" class="am-form-label">昵称</label>
                            <div class="am-form-content">
                                <input type="text" id="user-name2" name="user-name2" placeholder="nickname" value="${sessionScope.frontUser.nickName }">

                            </div>
                        </div>

                        <div class="am-form-group">
                            <label for="user-name" class="am-form-label">姓名</label>
                            <div class="am-form-content">
                                <input type="text" id="user-name" name="user-name" placeholder="name" value="${sessionScope.frontUser.name }">

                            </div>
                        </div>

                        <%--<div class="am-form-group">
                            <label class="am-form-label">性别</label>
                            <div class="am-form-content sex">
                                <label class="am-radio-inline">
                                    <input type="radio" name="radio10" class="sex" value="1" data-am-ucheck checked> 男
                                </label>
                                <label class="am-radio-inline">
                                    <input type="radio" name="radio10" class="sex" value="2" data-am-ucheck> 女
                                </label>
                                <label class="am-radio-inline">
                                    <input type="radio" name="radio10" class="sex" value="0" data-am-ucheck> 保密
                                </label>
                            </div>
                        </div>--%>

                        <div class="am-form-group">
                            <label for="user-birth" class="am-form-label">生日</label>
                            <div class="am-form-content birth">
                               <input type="text" name="user-birth" id="user-birth" placeholder="例如:2000-02-15" value="<fmt:formatDate value="${sessionScope.frontUser.birthday }" pattern="yyyy-MM-dd"/>">
                            </div>

                        </div>
                        <div class="am-form-group">
                            <label for="user-phone" class="am-form-label">电话</label>
                            <div class="am-form-content">
                                <input id="user-phone" name="user-phone" placeholder="telephonenumber" type="tel" value="${sessionScope.frontUser.phone }">

                            </div>
                        </div>
                        <div class="am-form-group">
                            <label for="user-email" class="am-form-label">电子邮件</label>
                            <div class="am-form-content">
                                <input id="user-email" name="user-email" placeholder="Email" type="email" value="${sessionScope.frontUser.email }">

                            </div>
                        </div>
                        <div class="info-btn">
                            <div class="am-btn am-btn-danger"> <input type="button" class="am-btn am-btn-danger" value="保存修改" id="upBtn"></div>
                        </div>

                    </form>
                </div>

            </div>

        </div>
        <!--底部-->
        <div class="footer">
            <div class="footer-hd">
                <p>
                    <a href="http://www.itcast.cn">传智播客</a>
                    <b>|</b>
                    <a href="javascript:void(0)">商城首页</a>
                    <b>|</b>
                    <a href="javascript:void(0)">支付宝</a>
                    <b>|</b>
                    <a href="javascript:void(0)">物流</a>
                </p>
            </div>
            <div class="footer-bd">
                <p>
                    <a href="http://www.itcast.cn">关于黑马</a>
                    <a href="javascript:void(0)">合作伙伴</a>
                    <a href="javascript:void(0)">联系我们</a>
                    <a href="javascript:void(0)">网站地图</a>
                    <em>© 2015-2025 Hengwang.com 版权所有</em>
                </p>
            </div>
        </div>
    </div>

    <aside class="menu">
        <ul>
            <li class="person">
                <a href="index.html">个人中心</a>
            </li>
            <li class="person">
                <a href="javascript:void(0)">个人资料</a>
                <ul>
                    <li class="active"> <a href="information.html">个人信息</a></li>
                    <li> <a href="safety.html">安全设置</a></li>
                    <li> <a href="${pageContext.request.contextPath}/front/adress.jsp">收货地址</a></li>
                </ul>
            </li>
            <li class="person">
                <a href="javascript:void(0)">我的交易</a>
                <ul>
                    <li><a href="order.jsp">订单管理</a></li>
                    <li> <a href="change.html">退款售后</a></li>
                </ul>
            </li>
            <li class="person">
                <a href="javascript:void(0)">我的资产</a>
                <ul>
                    <li> <a href="coupon.html">优惠券 </a></li>
                    <li> <a href="bonus.html">红包</a></li>
                    <li> <a href="bill.html">账单明细</a></li>
                </ul>
            </li>

            <li class="person">
                <a href="javascript:void(0)">我的小窝</a>
                <ul>
                    <li> <a href="collection.html">收藏</a></li>
                    <li> <a href="foot.html">足迹</a></li>
                    <li> <a href="comment.html">评价</a></li>
                    <li> <a href="news.html">消息</a></li>
                </ul>
            </li>

        </ul>

    </aside>
</div>

</body>
<script>
    $(function() {
        var userName='${sessionScope.frontUser.username }';
        var content="";
        if (userName){
            content="<ul class=\"message-l\">\n" +
                "            <div class=\"topMessage\">\n" +
                "                <div class=\"menu-hd\">\n" +
                "                    <a href=\"#\" target=\"_top\" class=\"h\">Hi,${sessionScope.frontUser.username }</a>\n" +
                "                </div>\n" +
                "            </div>\n" +
                "        </ul>"
        }else {
            content="<ul class=\"message-l\">\n" +
                "            <div class=\"topMessage\">\n" +
                "                <div class=\"menu-hd\">\n" +
                "                    <a href=\"${pageContext.request.contextPath}/UserController/login\" target=\"_top\" class=\"h\">亲，请登录</a>\n" +
                "                    <a href=\"${pageContext.request.contextPath}/UserController/regist\" target=\"_top\">免费注册</a>\n" +
                "                </div>\n" +
                "            </div>\n" +
                "        </ul>"
        }
        $("#top-lo").html(content);

        //修改事件
        $("#upBtn").click(function(){
            $.ajax({
                type : "POST",
                url: "${pageContext.request.contextPath }/UserController/updateInfo",
                data: {
                    username:$("#userName").val(),
                    phone:$("#user-phone").val(),
                    email:$("#user-email").val(),
                    nickName:$("#user-name2").val(),
                    name:$("#user-name").val(),
                    sex:$("#sex").val(),
                    birthday:$("#user-birth").val()
                },
                dataType: "json",
                success : function(data) {
                    var content = "";
                    content = "<div class=\"am-form-group\">\n" +
                        "                            <label for=\"userName\" class=\"am-form-label\">用户名</label>\n" +
                        "                            <div class=\"am-form-content\">\n" +
                        "                                <input type=\"text\" id=\"userName\" name=\"userName\" readonly=\"readonly\" value=\"${sessionScope.frontUser.username }\">\n" +
                        "\n" +
                        "                            </div>\n" +
                        "                        </div>\n" +
                        "\n" +
                        "                        <div class=\"am-form-group\">\n" +
                        "                            <label for=\"user-name2\" class=\"am-form-label\">昵称</label>\n" +
                        "                            <div class=\"am-form-content\">\n" +
                        "                                <input type=\"text\" id=\"user-name2\" name=\"user-name2\" placeholder=\"nickname\" value="+data.nickName+">\n" +
                        "\n" +
                        "                            </div>\n" +
                        "                        </div>\n" +
                        "\n" +
                        "                        <div class=\"am-form-group\">\n" +
                        "                            <label for=\"user-name\" class=\"am-form-label\">姓名</label>\n" +
                        "                            <div class=\"am-form-content\">\n" +
                        "                                <input type=\"text\" id=\"user-name\" name=\"user-name\" placeholder=\"name\" value="+data.name+">\n" +
                        "\n" +
                        "                            </div>\n" +
                        "                        </div>\n" +
                        "\n" +
                        "                        <div class=\"am-form-group\">\n" +
                        "                            <label for=\"user-birth\" class=\"am-form-label\">生日</label>\n" +
                        "                            <div class=\"am-form-content birth\">\n" +
                        "                               <input type=\"text\" name=\"user-birth\" id=\"user-birth\" placeholder=\"例如:2000-02-15\" value="+data.birthday+">\n"+
                        "                            </div>\n" +
                        "\n" +
                        "                        </div>\n" +
                        "                        <div class=\"am-form-group\">\n" +
                        "                            <label for=\"user-phone\" class=\"am-form-label\">电话</label>\n" +
                        "                            <div class=\"am-form-content\">\n" +
                        "                                <input id=\"user-phone\" name=\"user-phone\" placeholder=\"telephonenumber\" type=\"tel\" value="+data.phone+">\n" +
                        "\n" +
                        "                            </div>\n" +
                        "                        </div>\n" +
                        "                        <div class=\"am-form-group\">\n" +
                        "                            <label for=\"user-email\" class=\"am-form-label\">电子邮件</label>\n" +
                        "                            <div class=\"am-form-content\">\n" +
                        "                                <input id=\"user-email\" name=\"user-email\" placeholder=\"Email\" type=\"email\" value="+data.email+">\n" +
                        "\n" +
                        "                            </div>\n" +
                        "                        </div>\n" +
                        "                        <div class=\"info-btn\">\n" +
                        "                            <div class=\"am-btn am-btn-danger\"> <input type=\"button\" class=\"am-btn am-btn-danger\" value=\"保存修改\" id=\"upBtn\"></div>\n" +
                        "                        </div>"
                    $("#form").html(content);
                },
                error : function () {
                    alert("异步请求失败");
                }
            })
        })
    })

</script>
</html>
